<template>
  <div>
    <page-list :x-uri="uri" :doactions="doactions" :custom-components="custom">
      <!-- 自定义tab -->
      <template v-slot:page-tabs>
        <tabs :tabs="tabs" />
      </template>
      <!-- 页面操作按钮 -->
      <template v-slot:page-button>
        <el-button v-auth="'exam.module.config'" size="mini" type="primary" @click="addPaper">关联试卷</el-button>
      </template>
      <!-- 多选操作 -->
      <template v-slot:table-button="scope">
        <el-button v-auth="'exam.module.config'" size="mini" @click="deletes(scope)">批量移除</el-button>
      </template>
    </page-list>
    <choose-paper v-if="chooseVisible" @close="chooseVisible = false" />
    <set-price v-if="priceVisible" :row="currentRow" @close="closePriceVisble" />
  </div>
</template>

<script>
import PageList from '@public/template/page_list.vue';
import Tabs from '../tabs';
import ChoosePaper from './examination/choose/index.vue';
import Status from './components/examination_status.vue';
import Price from './components/examination_price.vue';
import SetPrice from './examination/price/set_price.vue';
export default {
  components: {
    PageList,
    Tabs,
    ChoosePaper,
    SetPrice
  },
  inject: ['reload'],
  data() {
    return {
      uri: '/exam/admin/module/' + this.$route.params.id + '/examination/config',
      tabs: [
        {
          title: '考试试卷管理',
          uri: '/exam/module/' + this.$route.params.id + '/examination/config',
          meta: {
            permission: 'exam.module.config'
          }
        }
      ],
      doactions: [
        { title: '设置价格', meta: { permission: 'exam.module.config' }, callback: this.setPrice },
        { title: '移除', meta: { permission: 'exam.module.config' }, callback: this.delete }
      ],
      custom: {
        status: Status,
        price: Price
      },
      // 选择试卷弹出层
      chooseVisible: false,
      // 设置价格弹出层
      priceVisible: false,
      currentRow: {}
    };
  },
  methods: {
    // 新增试卷
    addPaper() {
      this.chooseVisible = true;
    },
    // 设置价格
    setPrice({ row }) {
      this.currentRow = row;
      this.priceVisible = true;
    },
    closePriceVisble(price) {
      if (this.$util.isDef(price)) {
        this.$set(this.currentRow, 'price', price);
      }

      this.priceVisible = false;
    },
    // 移除试卷
    delete: function({ row }) {
      this.$box
        .confirm('确认移除试卷吗')
        .then(() => {
          this.$http.delete(
            '/exam/admin/module/' + this.$route.params.id + '/examination/' + row.id + '/delete',
            {},
            response => {
              this.$message.success(response.msg, _ => {
                this.reload();
              });
            },
            error => {
              this.$message.error(error.msg);
            }
          );
        })
        .catch(() => {});
    },
    // 批量移除试卷
    deletes: function({ rows }) {
      var ids = rows.map(row => row.id);
      if (ids.length === 0) {
        this.$message.warning('请选择要移除的试卷');
        return false;
      }
      ids = ids.join(',');
      this.$box
        .confirm('确认移除选中的试卷吗')
        .then(() => {
          this.$http.delete(
            '/exam/admin/module/' + this.$route.params.id + '/examination/deletes/' + ids,
            {},
            response => {
              this.$message.success(response.msg, _ => {
                this.reload();
              });
            },
            error => {
              this.$message.error(error.msg);
            }
          );
        })
        .catch(() => {});
    }
  }
};
</script>

<style></style>
